<!DOCTYPE html>
<html lang="en">

<head>
    <!-- 编码设置 -->
    <meta charset="utf-8">
    <!-- 告诉IE使用最新的引擎渲染页面 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- 使移动应用程序占据整个浏览器屏幕并禁用用户缩放-->
    <meta name="viewport"
        content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <!-- 页面描述:大屏仓库 -->
    <meta name="description" content="big screen store">
    <!-- 作者 -->
    <meta name="author" content="lbh">
    <title>大屏仓库</title>
    <link rel="stylesheet" href="assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/liMarquee/css/liMarquee.css">
    <link rel="stylesheet" href="assets/css/animate.min.css">
    <link rel="stylesheet" href="assets/css/style.css">
    <link rel="stylesheet" href="assets/css/main.css">
    <link rel="stylesheet" href="assets/css/app.css">
    <style>
        .dowebok {
            width: 100%;
            height:223px;
            font-size: 14px;
            overflow: hidden;
        }

        .dowebok ul {
            margin: 0;
            height: 100%;
            overflow: hidden;
            
        }
        .dowebok a {
            color: #fff;
            text-decoration: none;
            line-height: 30px;
        }

    </style>
    <!-- HTML5----IE低版本支持HTML5标签方法，css 浏览器网页兼容性 -->
    <!--[if lt IE9]>
            <script src="assets/js/html5shiv.min.js"></script>
            <script src="assets/js/respond.min.js"></script>
        <![endif]-->
</head>

</html>

<body>
    <!-- 
        	<div class="bg1 wow fadeInUp"></div>
        <li class="item item1 wow bounceInLeft"></li>
				<li class="item item2 wow bounceInLeft"></li>
				<li class="item item3 wow bounceInLeft"></li>
				<li class="item item4 wow bounceInLeft"></li>
				<li class="item item5 wow bounceInRight"></li>
				<li class="item item6 wow bounceInRight"></li>
				<li class="item item7 wow bounceInRight"></li>
				<li class="item item8 wow bounceInRight"></li>

        <li class="item item2 wow fadeInUpBig" data-wow-delay="0.3s"></li>
			<li class="item item3 wow fadeInUpBig" data-wow-delay="0.6s"></li>
			<li class="item item4 wow fadeInUpBig" data-wow-delay="0.9s"></li>
			<li class="item item5 wow fadeInUpBig" data-wow-delay="1.2s"></li>
     -->
    <div id="hompage">
        <div id="maincontainer">
            <div id="body" class="pagePadding">
                <div class="header flex jc-between">
                    <div class="header-logo"></div>
                    <div class="header-title"></div>
                    <div class="header-time">
                        <div id="clock"></div>
                    </div>
                </div>
                <div class="section">
                    <div class="maincontent m1 flex jc-between">
                        <!-- 可以加入 data-wow-duration（动画持续时间）和 data-wow-delay（动画延迟时间）属性，
                            data-wow-iteration="2"(动画执行次数) 和 data-wow-offset="10" （距离可视区域多少开始执行动画）-->
                        <div class="left wow bounceInLeft"  data-wow-duration="1s" data-wow-delay="0s">
                            <div  class="jbox ">
                                <div class="jbox-title clearfix special-title" style="padding-top:0;">
                                    <div class="h5 pull-left">
                                        <div class="site-item" style="width:75px;height:20px;border:none;">
                                            <div class="site-item-front">
                                                <span style="color:#00ACED">微博热点</span>
                                            </div>
                                            <div class="site-item-back">
                                                <span style="color:#00ACED">微信热点</span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="jbox-content">
                                    <div id="siteItem-list">
                                        <div class="site-item">
                                            <div class="site-item-front">
                                                <a class="link_list" title="欧亚经济论坛“一带一路”女性论坛举行" href="javascript:;">
                                                    <div class="site-item-body">
                                                        以快乐之名，与你相遇，↵我的青春有你，你的快乐有我，↵20岁，谢谢亲爱的你，↵陪我从过去到现在和未来↵前路可期，一直在一起！↵#快乐大本营二十周年#↵@何炅
                                                        @谢娜 @李维嘉 @吴昕 @杜海涛
                                                    </div>
                                                    <div class="site-item-foot ">
                                                        <div class="site-item-foot-a pull-left">陕西传媒网</div>
                                                        <div class="site-item-foot-b pull-right">2017-09-23 07:10:00
                                                        </div>
                                                    </div>
                                                </a>
                                            </div>
                                            <div class="site-item-back">
                                                <a class="link_list" title="欧亚经济论坛“一带一路”女性论坛举行" href="javascript:;">
                                                    <div class="site-item-body">
                                                        昂萨莉说 ，随着女性社会地位的提高 ，举办<font class="media-keyWord"> “一带一路 ”</font>
                                                        女性论坛意义非凡 。
                                                    </div>
                                                    <div class="site-item-foot clearfix">
                                                        <div class="site-item-foot-a pull-left">陕西传媒网</div>
                                                        <div class="site-item-foot-b pull-right">2017-09-23 07:10:00
                                                        </div>
                                                    </div>
                                                </a>
                                            </div>
                                        </div>
                                        <div class="site-item">
                                            <div class="site-item-front">
                                                <a class="link_list" title="欧亚经济论坛“一带一路”女性论坛举行" href="javascript:;">
                                                    <div class="site-item-body">
                                                        以快乐之名，与你相遇，↵我的青春有你，你的快乐有我，↵20岁，谢谢亲爱的你，↵陪我从过去到现在和未来↵前路可期，一直在一起！↵#快乐大本营二十周年#↵@何炅
                                                        @谢娜 @李维嘉 @吴昕 @杜海涛
                                                    </div>
                                                    <div class="site-item-foot ">
                                                        <div class="site-item-foot-a pull-left">陕西传媒网</div>
                                                        <div class="site-item-foot-b pull-right">2017-09-23 07:10:00
                                                        </div>
                                                    </div>
                                                </a>
                                            </div>
                                            <div class="site-item-back">
                                                <a class="link_list" title="欧亚经济论坛“一带一路”女性论坛举行" href="javascript:;">
                                                    <div class="site-item-body">
                                                        昂萨莉说 ，随着女性社会地位的提高 ，举办<font class="media-keyWord"> “一带一路 ”</font>
                                                        女性论坛意义非凡 。
                                                    </div>
                                                    <div class="site-item-foot clearfix">
                                                        <div class="site-item-foot-a pull-left">陕西传媒网</div>
                                                        <div class="site-item-foot-b pull-right">2017-09-23 07:10:00
                                                        </div>
                                                    </div>
                                                </a>
                                            </div>
                                        </div>
                                        <div class="site-item">
                                            <div class="site-item-front">
                                                <a class="link_list" title="欧亚经济论坛“一带一路”女性论坛举行" href="javascript:;">
                                                    <div class="site-item-body">
                                                        以快乐之名，与你相遇，↵我的青春有你，你的快乐有我，↵20岁，谢谢亲爱的你，↵陪我从过去到现在和未来↵前路可期，一直在一起！↵#快乐大本营二十周年#↵@何炅
                                                        @谢娜 @李维嘉 @吴昕 @杜海涛
                                                    </div>
                                                    <div class="site-item-foot ">
                                                        <div class="site-item-foot-a pull-left">陕西传媒网</div>
                                                        <div class="site-item-foot-b pull-right">2017-09-23 07:10:00
                                                        </div>
                                                    </div>
                                                </a>
                                            </div>
                                            <div class="site-item-back">
                                                <a class="link_list" title="欧亚经济论坛“一带一路”女性论坛举行" href="javascript:;">
                                                    <div class="site-item-body">
                                                        昂萨莉说 ，随着女性社会地位的提高 ，举办<font class="media-keyWord"> “一带一路 ”</font>
                                                        女性论坛意义非凡 。
                                                    </div>
                                                    <div class="site-item-foot clearfix">
                                                        <div class="site-item-foot-a pull-left">陕西传媒网</div>
                                                        <div class="site-item-foot-b pull-right">2017-09-23 07:10:00
                                                        </div>
                                                    </div>
                                                </a>
                                            </div>
                                        </div>
                                        <!--siteItem-list end -->
                                    </div>
                                </div>
                            </div>

                        </div>
                        <div class="center wow fadeInUp">
                            <div class="jbox">
                                <div class="jbox-title clearfix" style="padding-top:0;">
                                    <div class="h5 pull-left twinkling">
                                        <!-- <i class="fa fa-stop"></i> --> 实时数据
                                    </div>
                                </div>
                                <div class="jbox-content">

                                    <!-- <div class="new_list5a new_list_top" style="clear: both;">
                                                <ul id="realTime-visitList" class="list-unstyled custom-content-box1"></ul>
                                                <input type="text" hidden class="hide_id5a" value="-1">
                                            </div> -->
                                    <ul id="realTime-visitList" class="list-unstyled custom-content-box1"
                                        style="height:200px">
                                    </ul>
                                </div>
                            </div>

                        </div>
                        <div class="right wow fadeInRight" data-wow-duration="1s" data-wow-delay="0s">
                            <div class="ibox">
                                <div class="ibox-title ibox-title-special"></div>
                                <div class="ibox-content">
                                    <div id="echart-pie" style="width:100%;height:100%"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="maincontent m2 flex jc-between">
                        <div class="left">
                            <div class="ibox">
                                <div class="ibox-title">

                                </div>
                                <div class="ibox-content">
                                    <div id="echart-line" style="width: 100%;height: 100%"></div>
                                </div>
                            </div>
                        </div>
                        <div class="center">
                            <div class="ibox">
                                <div class="ibox-title">

                                </div>
                                <div class="ibox-content">
                                    <div id="echart-twoline" style="width: 100%;height: 100%"></div>
                                </div>
                            </div>

                        </div>
                        <div class="right">
                            <div class="ibox">
                                <div class="ibox-title">

                                </div>
                                <div class="ibox-content">
                                    <div id="echart-writebar" style="width: 100%;height: 100%"></div>

                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="maincontent m3 flex jc-between">
                        <div class="left">
                            <div class="ibox">
                                <div class="ibox-title">

                                </div>
                                <div class="ibox-content">
                                    <div id="echart-getbar" style="width: 100%;height: 100%"></div>
                                </div>
                            </div>
                        </div>
                        <div class="center">
                            <div class="ibox">
                                <div class="ibox-title">
                                    文字滚动
                                </div>
                                <div class="ibox-content">
                                    <div class="dowebok">
                                        <ul>
                                            <li>
                                                <a href="http://www.dowebok.com/187.html">Smoothslides –
                                                    可平移的jQuery幻灯片插件</a>
                                            </li>
                                            <li>
                                                <a href="http://www.dowebok.com/77.html">jQuery全屏滚动插件fullPage.js</a>
                                            </li>
                                            <li>
                                                <a href="http://www.dowebok.com/131.html">WOW.js – 让页面滚动更有趣</a>
                                            </li>
                                            <li>
                                                <a href="http://www.dowebok.com/139.html">让IE7 IE8支持CSS3
                                                    background-size属性</a>
                                            </li>
                                            <li>
                                                <a href="http://www.dowebok.com/117.html">shCircleLoader – jQuery
                                                    Loading效果插件</a>
                                            </li>
                                            <li>
                                                <a href="http://www.dowebok.com/185.html">jQuery cForm –
                                                    jQuery表单美化插件</a>
                                            </li>
                                            <li>
                                                <a href="http://www.dowebok.com/177.html">Quttons – Quantum
                                                    Paper风格按钮</a>
                                            </li>
                                            <li>
                                                <a href="http://www.dowebok.com/173.html">Ideal Image Slider –
                                                    简单的纯JS幻灯片</a>
                                            </li>
                                            <li>
                                                <a href="http://www.dowebok.com/156.html">evenZoom – jQuery放大镜插件</a>
                                            </li>
                                            <li>
                                                <a href="http://www.dowebok.com/155.html">DAD – jQuery拖拽/拖放插件</a>
                                            </li>
                                        </ul>
                                    </div>
                                    </ul>
                                </div>
                            </div>


                        </div>
                        <div class="right">

                        </div>
                    </div>
                </div>
                <div class="footer"></div>
            </div>
        </div>
    </div>
    <script src="assets/js/jquery-3.3.1.min.js"></script>
    <script src="assets/js/echarts.js"></script>
    <script src="assets/js/clock.js"></script>
    <script src="assets/js/wow.min.js"></script>
    <script src="assets/liMarquee/js/jquery.liMarquee.js"></script>
    <script src="assets/scroll/init.js"></script>
    <script src="assets/scroll/news.js"></script>
    <script src="assets/scroll/move.js"></script>
    <script src="assets/scroll/startup.js"></script>
    <script src="assets/js/main.js"></script>
    <script>
       
        $('.dowebok').liMarquee({
            direction: 'up',
            runshort: false,
            scrolldelay:1
        });
        if (!(/msie [6|7|8|9]/i.test(navigator.userAgent))){
            var wow = new WOW({
                boxClass: 'wow',//需要执行动画的元素的 class
                animateClass: 'animated',//animation.css 动画的 class
                offset: 0,//距离可视区域多少开始执行动画
                mobile: true,//是否在移动设备上执行动画
                live: true//异步加载的内容是否有效
            });
            wow.init();
        };
      
    </script>
</body>